<template>
    <div>
      <div id="bookresult">
        <div class="item" v-for="book in books" :key="book.isbn">
          <span id="img-div">
            <img :src="require(`../assets/bookimg/${book.isbn}.jpg`)" @click="$emit('change', book)">
          </span>
          <div class="bookmess">
            <span id="bookname" @click="$emit('change', book)">{{ book.bookname }}</span>
            <span>作者：{{ book.author }}</span>
            <span>出版社：{{ book.pubfirm }}</span>
            <span>类型：{{ book.type }}</span>
          </div>
          <div class="money">
            <span id="num">￥{{ book.price }}</span>
            <span>库存: {{ book.stock }}</span>
            <button @click="addCart(book)">加入购物车</button>
          </div>
        </div>
        <h3>{{ mess }}</h3>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    name: 'authorbooks',
    props: {
      books: Array, // 接收来自父组件的书籍列表
      mess: String, // 接收来自父组件的消息
    },
    methods: {
      addCart(book) {
        if (sessionStorage.username) {
          this.$store.commit('addCart', book);
        } else {
          this.$router.push({ path: '/init' });
        }
      },
    },
  };
  </script>
  
  <style src="../style/bookresult.css" scoped>
  /* 样式代码 */
  </style>
  